<template>
  <div class="app-container">
      <div class="filter-container">
        <el-button type="primary" @click="addDepositClick()" style="margin-left:0px;">新增定金收款</el-button>
        <el-input clearable v-model="search.number" placeholder="合同号/客户姓名/电话" style="width: 170px;margin-left:10px;"></el-input>
        
        <el-date-picker v-model="search.daterange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" style="margin-left:10px;">
        </el-date-picker>
        <el-button type="primary" icon="el-icon-search" @click="searchClick()" style="margin-left:10px;">查询</el-button>
    </div>
    <el-table v-loading="listLoading" :data="list" 
      border fit highlight-current-row stripe 
      style="width: 100%">
      <el-table-column align="center" label="序" width="80">
        <template slot-scope="scope">
          <span>{{ scope.row._id }}</span>
        </template>
      </el-table-column>
     <el-table-column  min-width="100" align="center" label="订单合同号">
        <template slot-scope="scope">
          <span>{{ scope.row.contractnumber }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="销售单号">
        <template slot-scope="scope">
          <span>{{ scope.row.salesnumber }}</span>
        </template>
      </el-table-column>
      
      <el-table-column  min-width="100" align="center" label="日期">
        <template slot-scope="scope">
          <span>{{ scope.row.salesdate }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="客户姓名">
        <template slot-scope="scope">
          <span>{{ scope.row.customername }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="联系电话">
        <template slot-scope="scope">
          <span>{{ scope.row.customerphone }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="具体车型">
        <template slot-scope="scope">
          <span>{{ scope.row.salescar }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="VIN码">
        <template slot-scope="scope">
          <span>{{ scope.row.vincode }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="合同金额">
        <template slot-scope="scope">
          <span>{{ scope.row.salesprice}}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="付款类型">
        <template slot-scope="scope">
          <span>{{ scope.row.paytype  }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="已收全款">
        <template slot-scope="scope">
          <span>{{ scope.row.fullpaystate  }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="加装办理">
        <template slot-scope="scope">
          <span>{{ scope.row.extraaddstate  }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="保险办理">
        <template slot-scope="scope">
          <span>{{ scope.row.insurancestate  }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="代办办理">
        <template slot-scope="scope">
          <span>{{ scope.row.agencystate  }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="赎证">
        <template slot-scope="scope">
          <span>{{ scope.row.redemptioncert?'是':'否' }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="状态">
        <template slot-scope="scope">
          <span>{{ scope.row.salestate }}</span>
        </template>
      </el-table-column>
      <el-table-column  min-width="100" align="center" label="日期">
        <template slot-scope="scope">
          <span>{{ scope.row.createtime | parseTime('{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      
      <el-table-column align="center" label="操作"  width="380" fixed="right">
        <template slot-scope="scope">
          <el-button type="primary" size="small" @click="tableRowClick().collect(scope.row.id)">收款</el-button>
          <el-button type="primary" size="small" @click="tableRowClick().billing(scope.row.id)">开票</el-button>
          <el-button type="primary" size="small" @click="tableRowClick().loan(scope.row.id)">借款</el-button>
          <el-button type="primary" size="small" @click="tableRowClick().pay(scope.row.id)">付款</el-button>
          <el-button type="primary" size="small" @click="tableRowClick().pickup(scope.row.id)">开提车单</el-button>
          <el-button type="primary" size="small" @click="tableRowClick().process(scope.row.id)">进度</el-button>
          <el-button type="primary" size="small" @click="tableRowClick().deposit(scope.row.id)">收定金</el-button>
          <el-button type="primary" size="small" @click="tableRowClick().depositbill(scope.row.id)">收款凭据</el-button>
          <router-link :to="'/presalemanage/sales/saleslipdetails/'+scope.row.id">
            <el-button type="primary" size="small" style="margin-left:5px;">
              详情
            </el-button>
          </router-link>
          
        </template>
      </el-table-column>
    </el-table>

    <pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.rows" @pagination="getList" />


<!-- 新增定金收款 -->
<el-dialog :title="dialogAddDeposit.title" :visible.sync="dialogAddDeposit.visible"  width="900px">
    <div class="ci" v-show="dialogAddDeposit.step==1">
        <div class="item" style="margin-bottom:10px;">
            <span class="name">检索联系人：</span>
            <span class="value">
                <el-input v-model="dialogAddDeposit.search.key" placeholder="姓名/电话"  style="width:320px;"></el-input>
                <el-button type="primary" @click="dialogAddDepositClick().search()" style="margin-left:10px;">查询</el-button>
                <el-button type="primary" @click="dialogAddDepositClick().add()" v-show="dialogAddDeposit.datastate==2" style="margin-left:10px;">新增联系人</el-button>
            </span>
        </div>
        <el-table v-loading="dialogAddDeposit.listLoading" :data="dialogAddDeposit.list" 
            border fit highlight-current-row stripe 
            style="width: 100%">
            <el-table-column align="center" label="序" width="80">
                <template slot-scope="scope">
                <span>{{ scope.row._id }}</span>
                </template>
            </el-table-column>
            <el-table-column  min-width="100" align="center" label="客户姓名">
                <template slot-scope="scope">
                <span>{{ scope.row.customername }}</span>
                </template>
            </el-table-column>
            <el-table-column  min-width="100" align="center" label="电话">
                <template slot-scope="scope">
                <span>{{ scope.row.customerphone }}</span>
                </template>
            </el-table-column>
            <el-table-column  min-width="100" align="center" label="具体车型">
                <template slot-scope="scope">
                <span>{{ scope.row.car }}</span>
                </template>
            </el-table-column>
            <el-table-column  min-width="100" align="center" label="置业顾问">
                <template slot-scope="scope">
                <span>{{ scope.row.guider }}</span>
                </template>
            </el-table-column>
            <el-table-column align="center" label="操作"  width="180">
                <template slot-scope="scope">
                    <el-button type="primary" size="small" @click="dialogAddDepositClick().rowSelect(scope.row.id)">选择</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
    <div class="ci" v-show="dialogAddDeposit.step==2">
        <div class="item">
            <span class="name">姓名</span>
            <span class="value">
                <el-input v-model="dialogAddDeposit.data.customername" style="width:220px;"></el-input>
            </span>
        </div>
        <div class="item">
            <span class="name">电话</span>
            <span class="value">
                <el-input v-model="dialogAddDeposit.data.customerphone" style="width:220px;"></el-input>
            </span>
        </div>
        <div class="item">
            <span class="name">具体车型</span>
            <span class="value">
                <el-input v-model="dialogAddDeposit.data.car" style="width:220px;"></el-input>
            </span>
        </div>
        <div class="item">
            <span class="name">置业顾问</span>
            <span class="value">
                <el-select v-model="dialogAddDeposit.data.guider" clearable placeholder="--" style="width: 220px;">
                    <el-option 
                    v-for="(item,index) in selectOptions.guider"
                    :key="index"
                    :label="item.label"
                    :value="item.value">
                    </el-option>
                </el-select>
            </span>
        </div>
    </div>
    <div class="ci" v-show="dialogAddDeposit.step==3">
        <div class="item">
            <span class="name">姓名</span>
            <span class="value">
                <el-input v-model="dialogAddDeposit.data.customername" style="width:220px;"></el-input>
            </span>
        </div>
        <div class="item">
            <span class="name">电话</span>
            <span class="value">
                <el-input v-model="dialogAddDeposit.data.customerphone" style="width:220px;"></el-input>
            </span>
        </div>
        <div class="item">
            <span class="name">具体车型</span>
            <span class="value">
                <el-input v-model="dialogAddDeposit.data.car" style="width:220px;"></el-input>
            </span>
        </div>
        <div class="item">
            <span class="name">置业顾问</span>
            <span class="value">
                <el-input v-model="dialogAddDeposit.data.guider" style="width:220px;"></el-input>
            </span>
        </div>
        <div class="item">
            <span class="name">定金类型</span>
            <span class="value">
                <el-select v-model="dialogAddDeposit.data.deposittype" @change="dialogAddDepositClick().deposittypeChange($event)" clearable placeholder="--" style="width: 220px;">
                    <el-option 
                    v-for="(item,index) in selectOptions.deposittype"
                    :key="index"
                    :label="item.label"
                    :value="item.value">
                    </el-option>
                </el-select>
                <el-input :disabled="dialogAddDeposit.data.deposittype>1" v-model="dialogAddDeposit.data.depositmoney" placeholder="定金金额" style="width:220px;"></el-input>
            </span>
        </div>
        <div class="item">
            <span class="name">合同付款类型</span>
            <span class="value">
                <el-select v-model="dialogAddDeposit.data.paytype" clearable placeholder="--" style="width: 220px;">
                    <el-option 
                    v-for="(item,index) in selectOptions.paytype"
                    :key="index"
                    :label="item.label"
                    :value="item.value">
                    </el-option>
                </el-select>
            </span>
        </div>
        <div class="item">
            <span class="name">定金收款方式</span>
            <span class="value">
                <el-select v-model="dialogAddDeposit.data.collecttype" @change="dialogAddDepositClick().collecttypeChange($event)" clearable placeholder="--" style="width: 220px;">
                    <el-option 
                    v-for="(item,index) in selectOptions.collecttype"
                    :key="index"
                    :label="item.label"
                    :value="item.value">
                    </el-option>
                </el-select>
                <el-input v-show="dialogAddDeposit.data.collecttype>1" v-model="dialogAddDeposit.data.depositmoney" placeholder="开户行" style="width:220px;"></el-input>
            </span>
        </div>
    </div>
    <div slot="footer" class="dialog-footer">
        <el-button @click="dialogAddDeposit.visible = false">取 消</el-button>
        <el-button type="primary" v-show="dialogAddDeposit.step==2" @click="dialogAddDepositClick().saveCustomer()" :loading="dialogAddDeposit.saveloading">保 存</el-button>
        <el-button type="primary" v-show="dialogAddDeposit.step==3" @click="dialogAddDepositClick().saveDeposit()" :loading="dialogAddDeposit.saveloading">保 存</el-button>
    </div>
</el-dialog>
<!-- end 新增定金收款 -->

<!-- 收款 -->
<el-dialog :title="dialogCollect.title" :visible.sync="dialogCollect.visible"  width="700px">
    <div class="ci">
        <div class="item">
            <span class="name">购车付款类型</span>
            <span class="value">{{dialogCollect.data.paytype}}</span>
        </div>
        <div class="item">
            <span class="name">剩余应收款</span>
            <span class="value">{{dialogCollect.data.paymoney}}</span>
        </div>
        <div class="item">
            <span class="name">收款方式</span>
            <span class="value">
                <el-select v-model="dialogCollect.data.collecttype" clearable placeholder="--" style="width: 220px;">
                    <el-option 
                    v-for="(item,index) in selectOptions.collecttype"
                    :key="index"
                    :label="item.label"
                    :value="item.value">
                    </el-option>
                </el-select>
                <el-input v-show="dialogCollect.data.collecttype>1" v-model="dialogCollect.data.depositmoney" placeholder="开户行" style="width:220px;"></el-input>
            </span>
        </div>
        <div class="item">
            <span class="name">金额</span>
            <span class="value">
                <el-input v-model="dialogCollect.data.collectmoney" placeholder="" style="width:220px;"></el-input>
            </span>
        </div>
    </div>
    <div slot="footer" class="dialog-footer">
        <el-button @click="dialogCollect.visible = false">取 消</el-button>
        <el-button type="primary" @click="dialogCollectClick().save()" :loading="dialogCollect.saveloading">保 存</el-button>
    </div>
</el-dialog>
<!-- end 收款 -->

<!-- 开票 -->
<el-dialog :title="dialogBilling.title" :visible.sync="dialogBilling.visible"  width="700px">
    <div class="ci">
        <div class="bill" ref="dialogBillingBill">
            <div class="item">1、摘要：支付******供应商车款 已支付</div>
            <div class="item">2、科目：</div>
            <div class="item">借1：113200n 预付账款-***单位  金额=23409.00元</div>
            <div class="item">贷1：113300n 中国银行 36月按揭贷款 金额=360000.00元</div>
            <div class="item">贷2：融资支付 210100n 金额=360000.00元</div>
            <div class="item">贷3：厂家返利支付， 1133 单位：**** 金额=360000.00元</div>
        </div>
        
    </div>
    <div slot="footer" class="dialog-footer">
        <el-button @click="dialogBilling.visible = false">取 消</el-button>
        <el-button type="primary" @click="dialogBillingClick().print()" :loading="dialogBilling.saveloading">打 印</el-button>
        <el-button type="primary" @click="dialogBillingClick().save()" :loading="dialogBilling.saveloading">保 存</el-button>
    </div>
</el-dialog>
<!-- end 开票 -->

<!-- 借款 -->
<el-dialog :title="dialogLoan.title" :visible.sync="dialogLoan.visible"  width="700px">
    <div class="ci" v-show="dialogLoan.step==1">
        <div class="item">
            <span class="name">购置税</span>
            <span class="value">
                <el-input v-model="dialogLoan.data.tax" placeholder="" style="width:220px;"></el-input>
            </span>
        </div>
        <div class="item">
            <span class="name">上牌费</span>
            <span class="value">
                <el-input v-model="dialogLoan.data.regfee" placeholder="" style="width:220px;"></el-input>
            </span>
        </div>
        <div class="item">
            <span class="name">居住证</span>
            <span class="value">
                <el-input v-model="dialogLoan.data.residence" placeholder="" style="width:220px;"></el-input>
            </span>
        </div>
    </div>
    <div class="ci"  v-show="dialogLoan.step==2">
        <div class="bill" ref="dialogBillingLoan">
            <div class="item">1、摘要：支付******供应商车款 已支付</div>
            <div class="item">2、科目：</div>
            <div class="item">借1：113200n 预付账款-***单位  金额=23409.00元</div>
            <div class="item">贷1：113300n 中国银行 36月按揭贷款 金额=360000.00元</div>
            <div class="item">贷2：融资支付 210100n 金额=360000.00元</div>
            <div class="item">贷3：厂家返利支付， 1133 单位：**** 金额=360000.00元</div>
        </div>
        
    </div>
    <div slot="footer" class="dialog-footer">
        <el-button @click="dialogLoan.visible = false">取 消</el-button>
        <el-button type="primary"  v-show="dialogLoan.step==2" @click="dialogLoanClick().print()" :loading="dialogLoan.saveloading">打 印</el-button>
        <el-button type="primary"  v-show="dialogLoan.step==1" @click="dialogLoanClick().save()" :loading="dialogLoan.saveloading">保 存</el-button>
    </div>
</el-dialog>
<!-- end 借款 -->

<!-- 付款 -->
<el-dialog :title="dialogPay.title" :visible.sync="dialogPay.visible"  width="700px">
    <el-tabs type="border-card" @tab-click="dialogPayClick().tabchange($event)">
        <el-tab-pane label="购置税/居住证">
            <div class="bill" ref="dialogBillingPay0">
                <div class="item">1、摘要：支付******购置税/居住证 已支付</div>
                <div class="item">2、科目：</div>
                <div class="item">借1：113200n 预付账款-***单位  金额=23409.00元</div>
                <div class="item">贷1：113300n 中国银行 36月按揭贷款 金额=360000.00元</div>
                <div class="item">贷2：融资支付 210100n 金额=360000.00元</div>
                <div class="item">贷3：厂家返利支付， 1133 单位：**** 金额=360000.00元</div>
            </div>
        </el-tab-pane>
        <el-tab-pane label="上牌费">
            <div class="bill" ref="dialogBillingPay1">
                <div class="item">1、摘要：支付******上牌费 已支付</div>
                <div class="item">2、科目：</div>
                <div class="item">借1：113200n 预付账款-***单位  金额=23409.00元</div>
                <div class="item">贷1：113300n 中国银行 36月按揭贷款 金额=360000.00元</div>
                <div class="item">贷2：融资支付 210100n 金额=360000.00元</div>
                <div class="item">贷3：厂家返利支付， 1133 单位：**** 金额=360000.00元</div>
            </div>
        </el-tab-pane>
        <el-tab-pane label="介绍费">
            <div class="bill" ref="dialogBillingPay2">
                <div class="item">1、摘要：支付******介绍费 已支付</div>
                <div class="item">2、科目：</div>
                <div class="item">借1：113200n 预付账款-***单位  金额=23409.00元</div>
                <div class="item">贷1：113300n 中国银行 36月按揭贷款 金额=360000.00元</div>
                <div class="item">贷2：融资支付 210100n 金额=360000.00元</div>
                <div class="item">贷3：厂家返利支付， 1133 单位：**** 金额=360000.00元</div>
            </div>
        </el-tab-pane>
    </el-tabs>
    <div slot="footer" class="dialog-footer">
        <el-button @click="dialogPay.visible = false">取 消</el-button>
        <el-button type="primary" @click="dialogPayClick().print()" :loading="dialogPay.saveloading">打 印</el-button>
    </div>
</el-dialog>
<!-- end 付款 -->

<!-- 开提车单 -->
<el-dialog :title="dialogPickup.title" :visible.sync="dialogPickup.visible"  width="700px">
    <div class="ci" v-show="dialogPickup.step==1">
        <div class="item">提车校验</div>
        <div class="item">
            <span class="name">车辆赎证</span>
            <span class="value">
                <i class="el-icon-success" style="color:#67c23a" v-if="dialogPickup.data.check1"></i>
                <i class="el-icon-error" style="color:#f56c6c" v-else></i>
            </span>
        </div>
        <div class="item">
            <span class="name">销售加装</span>
            <span class="value">
                <i class="el-icon-success" style="color:#67c23a" v-if="dialogPickup.data.check2"></i>
                <i class="el-icon-error" style="color:#f56c6c" v-else></i>
            </span>
        </div>
        
    </div>
    <div class="ci"  v-show="dialogPickup.step==2">
        <div class="bill" ref="dialogBillingPickup">
            <div class="item">1、摘要：支付******供应商车款 已支付</div>
            <div class="item">2、科目：</div>
            <div class="item">借1：113200n 预付账款-***单位  金额=23409.00元</div>
            <div class="item">贷1：113300n 中国银行 36月按揭贷款 金额=360000.00元</div>
            <div class="item">贷2：融资支付 210100n 金额=360000.00元</div>
            <div class="item">贷3：厂家返利支付， 1133 单位：**** 金额=360000.00元</div>
        </div>
        
    </div>
    <div slot="footer" class="dialog-footer">
        <el-button @click="dialogPickup.visible = false">取 消</el-button>
        <el-button type="primary"  v-show="dialogPickup.step==2" @click="dialogPickupClick().pickup()" :loading="dialogPickup.saveloading">确认开提车单</el-button>
        <el-button type="primary"  v-show="dialogPickup.step==1" @click="dialogPickupClick().next()" :loading="dialogPickup.saveloading">下一步</el-button>
    </div>
</el-dialog>
<!-- end 开提车单 -->

  </div>
</template>

<script>

import { deepClone,parseTime } from '@/utils'
import * as auth from '@/utils/auth'
import * as vehicleApi from '@/api/finance/vehicle'
import * as salesApi from '@/api/presale/sales'
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
import Print from '@/utils/print'


export default {
  name: 'IncomeInfo',
  components: { Pagination },
  data(){
    return{
      list: null,
      total: 0,
      listLoading: true,
      listQuery: {
        page: 1,
        rows: 20,
        number:'',
      },
      search:{
        number:'',
      },
      selectOptions:{
          deposittype:[
              {label:'普通',value:'1',money:''},
              {label:'活动1',value:'2',money:'2000'},
              {label:'活动2',value:'3',money:'10000'},
          ],
          paytype:[
              {label:'按揭',value:'按揭'},
              {label:'全款',value:'全款'},
          ],
          collecttype:[
              {label:'现金',value:'1'},
              {label:'银行',value:'2'},
          ]
      },
      dialogAddDeposit:{
          visible:false,
          saveloading:false,
          title:'新增定金收款',
          step:1,
          search:{
              key:'',
          },
          data:{
              deposittype:'1',
          },
          list:null,
          listLoading:false,
          datastate:0,
      },
      dialogCollect:{
          visible:false,
          saveloading:false,
          title:'收款',
          data:{
              paytype:'按揭',
              paymoney:'200013',
              collecttype:'1',
              collectmoney:'',
          },
      },
      dialogBilling:{
          visible:false,
          saveloading:false,
          title:'开票',
          data:{

          }
      },
      dialogLoan:{
          visible:false,
          saveloading:false,
          title:'借款',
          step:1,
          data:{
              tax:'',
              regfee:'',
              residence:''
          }
      },
      dialogPay:{
          visible:false,
          saveloading:false,
          title:'付款',
          tabindex:'0',
          data:{

          }
      },
      dialogPickup:{
          visible:false,
          saveloading:false,
          title:'开提车单',
          step:1,
          tabindex:'0',
          data:{
              check1:false,
              check2:true,
              check3:true,
              check4:true,
              check5:false,
              check6:true,
          }
      },
    }
  },
  created(){
      var that=this;
      that.searchClick();
  },
  mounted(){

  },
  filters:{
    parseSettleType(val){
       return ['','收益','提现'][val];
    }
  },
  methods: {
    getList(){
      var that=this;
      that.listLoading = true;
      
      salesApi.getSaleslipList(that.listQuery).then(res=>{
         if(res.data && res.data.items){
            that.list=[...res.data.items.map((item,index)=>{
              item._id=index+1;
              return item;
            })];
            that.listLoading = false;
            that.total=res.data.total || 0;
         }
      })
    },
    addDepositClick(){
        this.dialogAddDeposit.visible=true;
        this.dialogAddDeposit.step=1;
        this.dialogAddDeposit.datastate=0;
    },
    searchClick(){
      var that=this;
      that.listQuery.page=1;
      that.listQuery.number=that.search.number.trim();
      that.getList();
    },
    
    tableRowClick(){
        var that=this;
        return {
            collect(id){
                that.dialogCollect.visible=true;
            },
            billing(id){
                that.dialogBilling.visible=true;
            },
            loan(id){
                that.dialogLoan.visible=true;
            },
            pay(id){
                that.dialogPay.visible=true;
            },
            pickup(id){
                that.dialogPickup.visible=true;
            },
            process(id){

            },
            deposit(id){

            },
            depositbill(id){

            }
        }
    },
    dialogAddDepositClick(){
        var that=this;
        var dg=that.dialogAddDeposit;
        return {
            search(){
                dg.datastate=0;
                vehicleApi.getCustomerList({}).then(res=>{
                    if(res.data && res.data.items){
                        dg.list=res.data.items.map((item,index)=>{
                            item._id=index+1;
                            return item;
                        })
                    }
                    dg.datastate=dg.list.length>0?1:2;
                })
            },
            add(){
                dg.step=2;
            },
            deposittypeChange(val){
                var optItem=that.selectOptions.deposittype.filter(o=>o.value==val)[0];
                dg.data.depositmoney=optItem.money;
            },
            collecttypeChange(val){

            },
            rowSelect(id){
                dg.step=3;
            },
            saveCustomer(){
                dg.step=3;
            },
            saveDeposit(){

            }
        }
    },
    dialogCollectClick(){
        var that=this;
        return {
            save(){

            }
        }
    },
    dialogBillingClick(){
        var that=this;
        var printHandle=null;
        return {
            save(){

            },
            print(){
                if(!printHandle){
                    printHandle=new Print(that.$refs['dialogBillingBill']);
                }
                printHandle.Start();
            }
        }
    },
    dialogLoanClick(){
        var that=this;
        var dg=that.dialogLoan;
        return {
            print(){
                new Print(that.$refs['dialogBillingLoan']).Start();
            },
            save(){
                dg.step=2;
            }
        }
    },
    dialogPayClick(){
        var that=this;
        var dg=that.dialogPay;
        return {
            tabchange(tab){
                dg.tabindex=tab.index;
            },
            print(){
                new Print(that.$refs['dialogBillingPay'+dg.tabindex]).Start();
            },
        }
    },
    dialogPickupClick(){
        var that=this;
        var dg=that.dialogPickup;
        return {
            next(){
                dg.step=2;
            },
            print(){
                new Print(that.$refs['dialogBillingPickup']).Start();
            },
            pickup(){

            }
        }
    },
    
  }
}
</script>
<style scoped>

</style>
